<template>
  <div id="app">
    <router-view class="pages" />
  </div>
</template>

<script>
export default {
  mounted() {
    this.resetPc(document, window);
  },
  methods: {
    resetPc(doc, win) {
      var docEl = doc.documentElement,
        resizeEvt =
          "orientationchange" in window ? "orientationchange" : "resize",
        recalc = function() {
          var clientWidth = docEl.clientWidth;
          if (!clientWidth) return;
          docEl.style.fontSize = 100 * (clientWidth / 750) + "px";
          console.log(
            "docEl.style.fontSize: ",
            docEl.style.fontSize,
            clientWidth
          );
        };
      if (!doc.addEventListener) return;
      win.addEventListener(resizeEvt, recalc, false);
      doc.addEventListener("DOMContentLoaded", recalc, false);
    }
  }
};
</script>

<style lang="scss">
div{
  font-size: 14px;
}
.pages{
  min-height: 100vh;
  background: #E0E2DF;
}

</style>
